<template>
  <div>
    <Row>
        <Col span="10">
          <img class="logo" src="./images/logo_big.png" alt="1">
        </Col>
        <Col span="12">
          <Menu mode="horizontal" :theme="theme1" :active-name="activeName">
            <MenuItem name="1" to="/index">
              <Icon type="ios-paper" />首页
            </MenuItem>
            <MenuItem name="2" to="/product">
              <Icon type="ios-people" />
              产品
            </MenuItem>
            <MenuItem name="3" to="/company">
              <Icon type="ios-people" />
              公司
            </MenuItem>
          </Menu>
        </Col>
    </Row>
    <BackTop></BackTop>
  </div>
</template>
<script>
export default {
  data () {
    return {
      theme1: 'light',
      activeName: '1'
    }
  },
  methods: {
    /**
     * 初始化当前活动菜单
     */
    initActiveName () {
      let path = this.$route.path
      switch (path) {
        case '/index':
          this.activeName = '1'
          break
        case '/product':
          this.activeName = '2'
          break
        case '/company':
          this.activeName = '3'
          break
      }
    }
  },
  mounted () {
    this.initActiveName()
  }
}
</script>

<style>
.logo{
  height: 61px;
  width: 160px;
  padding-top: 5px;
}

.ivu-menu-horizontal{
  height: 66px;
  line-height: 66px;
}

.ivu-menu-horizontal.ivu-menu-light:after{
  background: none;
}
</style>
